<div class="top">
	<p>欢迎光临易果生鲜</p>
	<p>配送至：</p>
	<div class="addr">
		<a>北京</a>
		<span></span>
		<div class="addrCard">
			<div>
				<p>请根据您的收货地址选择</p>
				<a href="">全国其他城市>></a>
			</div>
			<!--<div>
				<h2>
					<img src="" alt="" />
					热门城市
				</h2>
				<ul>
					<li>
						<a href="">上海</a>
					</li>
					<li>
						<a href="">北京</a>
					</li>
					<li>
						<a href="">天津</a>
					</li>
					<li>
						<a href="">上海</a>
					</li>
					<li>
						<a href="">北京</a>
					</li>
					<li>
						<a href="">天津</a>
					</li>
					<li>
						<a href="">上海</a>
					</li>
					<li>
						<a href="">北京</a>
					</li>
					<li>
						<a href="">天津</a>
					</li>
				</ul>
			</div>
			<div class="cityList">
				<ul>
					<li>ABCDE</li>
					<li>FGHIJ</li>
					<li>KLMNO</li>
					<li>PQRST</li>
					<li>UVWXYZ</li>
				</ul>
				<div class="city">
					<dl>
						<dt>A</dt>
						<dt>B</dt>
						<dt>C</dt>
						<dt>D</dt>
					</dl>
					<dl>
						<dt>F</dt>
						<dt>G</dt>
						<dt>H</dt>
						<dt>J</dt>
					</dl>
					<dl>
						<dt>K</dt>
						<dt>L</dt>
						<dt>M</dt>
						<dt>N</dt>
					</dl>
					<dl>
						<dt>Q</dt>
						<dt>R</dt>
						<dt>S</dt>
						<dt>T</dt>
					</dl>
					<dl>
						<dt>W</dt>
						<dt>Z</dt>
						<dt>Y</dt>
						<dt>Z</dt>
					</dl>
				</div>
			</div>-->		
		</div>
	</div>
	<ul class="login">
		<li>
			<p>
				<a href="login.html">[登录]</a>
			</p>
			
		</li>
		<li>
			<p>
				<a href="register.html">[注册]</a>
			</p>
		</li>
		<li>
			<span></span>
			<p>
				<a href="">我的易果</a>
			</p>
			<span></span>					
			<div class="cardCon1" style="display:none;">
				<ul>
					<li></li>
					<li>
						<a href="">我的订单</a>
					</li>
					<li>
						<a href="">我的优惠券</a>
					</li>
					<li>
						<a href="">我的收藏</a>
					</li>
					<li>
						<a href="">我的悠币</a>
					</li>
					<li>
						<a href="">我的退换货</a>
					</li>
					<li>
						<a href="">预存款查询</a>
					</li>
					<li>
						<a href="">立即充值</a>
					</li>
				</ul>
			</div>
		</li>
		<li>
			<span></span>
			<p>
				<a href="">手机易果</a>
			</p>	
			<span></span>
			<div class="cardCon2" style="display:none;">
				<ul>
					<li></li>
					<li>
						<img src="img/qrcode_app.jpg" alt="" />
						<p>扫一扫下载APP</p>
					</li>
					<li>
						<img src="img/qrcode_wechat.jpg" alt="" />
						<p>易果生鲜微信</p>
					</li>
				</ul>
			</div>
		</li>
		<li>
			<span></span>
			<p>
				<a href="">储值卡</a>
			</p>
			
		</li>
		<li>
			<span></span>
			<p>
				<a href="">提货券入口</a>
			</p>
			
		</li>
	</ul>
</div>
<!--header-->
<div id="header">
	<header>
		<h1>
			<a href="">
				<img src="img/logo.png" alt="" />
			</a>
			
		</h1>
		<div class="search">
			<input type="text" name="search" class="shu" placeholder="输入商品名／编号／拼音"/>
			<input type="submit" value="搜索" class="sou"/>
			<div class="searchCon"></div>
			<ul>
				<li>
					<a href="">华盛顿樱桃</a>
				</li>
				<li>
					<a href="">夏橙</a>
				</li>
				<li>
					<a href="">奇异果</a>
				</li>
				<li>
					<a href="">小龙虾</a>
				</li>
				<li>
					<a href="">谷饲</a>
				</li>
				<li>
					<a href="">家佳康</a>
				</li>
				<li>
					<a href="">三文鱼</a>
				</li>
				<li>
					<a href="">贝类</a>
				</li>
				<li>
					<a href="">鳕鱼</a>
				</li>
				<li>
					<a href="">进口水</a>
				</li>
			</ul>
		</div>				
		<div class="shopCar">
			<a href="">
				<span></span>
				<span>0.0</span>
			</a>					
			<div class="shopCon">
				<p>购物车中还没有商品，赶紧选购吧！</p>
			</div>
		</div>
	</header>
</div>
<!--nav-->
<nav>
	<ul class="foodlist">
		<li>
			<a href="javascript:;">
				<p>全部商品分类</p>
				<span></span>
			</a>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>进口水果</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">进口水果</a>
				</p>
				<ul>
					<li>
						<a href="">奇异果</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">奇异果</a>
					</li>
					<li>
						<a href="">牛油果</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
					<li>
						<a href="">车厘子</a>
					</li>
				</ul>
				<div class="pic">
					<img src="img/shop1.png" alt="" />
				</div>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>国产水果</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">国产水果</a>
				</p>
				<ul>
					<li>
						<a href="">苹果</a>
					</li>
					<li>
						<a href="">梨</a>
					</li>
					<li>
						<a href="">葡萄</a>
					</li>
					<li>
						<a href="">葡萄</a>
					</li>
					<li>
						<a href="">葡萄</a>
					</li>
					<li>
						<a href="">葡萄</a>
					</li>
					<li>
						<a href="">葡萄</a>
					</li>
					<li>
						<a href="">葡萄</a>
					</li>
					<li>
						<a href="">葡萄</a>
					</li>
					<li>
						<a href="">葡萄</a>
					</li>
					<li>
						<a href="">葡萄</a>
					</li>								
				</ul>
				<div class="pic">
					<img src="img/shop2.png" alt="" />
				</div>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>精选肉类</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">精选肉类</a>
				</p>
				<ul>
					<li>
						<a href="">进口牛肉</a>
					</li>
					<li>
						<a href="">进口牛肉</a>
					</li>
					<li>
						<a href="">进口牛肉</a>
					</li>
					<li>
						<a href="">进口牛肉</a>
					</li>
					<li>
						<a href="">进口牛肉</a>
					</li>								
				</ul>
				<div class="pic">
					<img src="img/shop3.png" alt="" />
				</div>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>禽类蛋品</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">禽类蛋品</a>
				</p>
				<ul>
					<li>
						<a href="">鸡</a>
					</li>
					<li>
						<a href="">鸭</a>
					</li>
					<li>
						<a href="">鹅</a>
					</li>								
				</ul>
				<div class="pic">
					<img src="img/shop4.png" alt="" />
				</div>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>即享美食</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">即享美食</a>
				</p>
				<ul>
					<li>
						<a href="">独家秘制</a>
					</li>
					<li>
						<a href="">独家秘制</a>
					</li>
					<li>
						<a href="">独家秘制</a>
					</li>
					<li>
						<a href="">独家秘制</a>
					</li>
					<li>
						<a href="">独家秘制</a>
					</li>
					<li>
						<a href="">独家秘制</a>
					</li>
					<li>
						<a href="">独家秘制</a>
					</li>
					<li>
						<a href="">独家秘制</a>
					</li>
					<li>
						<a href="">独家秘制</a>
					</li>
					<li>
						<a href="">独家秘制</a>
					</li>								
				</ul>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>海鲜水产</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">海鲜水产</a>
				</p>
				<ul>
					<li>
						<a href="">三文鱼</a>
					</li>
					<li>
						<a href="">三文鱼</a>
					</li>
					<li>
						<a href="">三文鱼</a>
					</li>
					<li>
						<a href="">三文鱼</a>
					</li>
					<li>
						<a href="">三文鱼</a>
					</li>
					<li>
						<a href="">三文鱼</a>
					</li>
					<li>
						<a href="">三文鱼</a>
					</li>								
				</ul>
				<div class="pic">
					<img src="img/shop6.png" alt="" />
				</div>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>乳品糕点</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">乳品糕点</a>
				</p>
				<ul>
					<li>
						<a href="">奶酪</a>
					</li>
					<li>
						<a href="">奶酪</a>
					</li>
					<li>
						<a href="">奶酪</a>
					</li>
					<li>
						<a href="">奶酪</a>
					</li>
					<li>
						<a href="">奶酪</a>
					</li>
					<li>
						<a href="">奶酪</a>
					</li>
					<li>
						<a href="">奶酪</a>
					</li>
					<li>
						<a href="">奶酪</a>
					</li>
					<li>
						<a href="">奶酪</a>
					</li>
					<li>
						<a href="">奶酪</a>
					</li>
				</ul>
				<div class="pic">
					<img src="img/shop7.png" alt="" />
				</div>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>新鲜蔬菜</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">新鲜蔬菜</a>
				</p>
				<ul>
					<li>
						<a href="">叶菜类</a>
					</li>
					<li>
						<a href="">叶菜类</a>
					</li>
					<li>
						<a href="">叶菜类</a>
					</li>
					<li>
						<a href="">叶菜类</a>
					</li>
					<li>
						<a href="">叶菜类</a>
					</li>
					<li>
						<a href="">叶菜类</a>
					</li>								
				</ul>
				<div class="pic">
					<img src="img/shop8.png" alt="" />
				</div>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>方便速食</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">方便速食</a>
				</p>
				<ul>
					<li>
						<a href="">养生汤品</a>
					</li>
					<li>
						<a href="">养生汤品</a>
					</li>
					<li>
						<a href="">养生汤品</a>
					</li>
					<li>
						<a href="">养生汤品</a>
					</li>
					<li>
						<a href="">养生汤品</a>
					</li>
					<li>
						<a href="">养生汤品</a>
					</li>
					<li>
						<a href="">养生汤品</a>
					</li>
					<li>
						<a href="">养生汤品</a>
					</li>								
				</ul>
				<div class="pic">
					<img src="img/shop9.png" alt="" />
				</div>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>粮油杂货</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">粮油杂货</a>
				</p>
				<ul>
					<li>
						<a href="">面制品</a>
					</li>
					<li>
						<a href="">面制品</a>
					</li>
					<li>
						<a href="">面制品</a>
					</li>
					<li>
						<a href="">面制品</a>
					</li>
					<li>
						<a href="">面制品</a>
					</li>
					<li>
						<a href="">面制品</a>
					</li>								
				</ul>
				<div class="pic">
					<img src="img/shop10.png" alt="" />
				</div>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>饮料酒水</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">饮料酒水</a>
				</p>
				<ul>
					<li>
						<a href="">果汁饮料</a>
					</li>
					<li>
						<a href="">果汁饮料</a>
					</li>
					<li>
						<a href="">果汁饮料</a>
					</li>
					<li>
						<a href="">果汁饮料</a>
					</li>
					<li>
						<a href="">果汁饮料</a>
					</li>
					<li>
						<a href="">果汁饮料</a>
					</li>								
				</ul>
				<div class="pic">
					<img src="img/shop11.png" alt="" />
				</div>
			</div>
		</li>
		<li>
			<a href="">
				<span></span>
				<p>礼品礼券</p>
			</a>
			<div class="contentlist">
				<p>
					<a href="">礼品礼券</a>
				</p>
				<ul>
					<li>
						<a href="">礼品礼盒</a>
					</li>
					<li>
						<a href="">礼品礼盒</a>
					</li>
					<li>
						<a href="">礼品礼盒</a>
					</li>
					<li>
						<a href="">礼品礼盒</a>
					</li>								
				</ul>
				<div class="pic">
					<img src="img/shop12.png" alt="" />
				</div>
			</div>
		</li>
	</ul>
	<ul>
		<li>
			<a href="">新品专区</a>
		</li>
		<li>
			<a href="">优质生活</a>
		</li>
		<li>
			<a href="">银行专区</a>
		</li>
		<li>
			<a href="">菜谱专栏</a>
		</li>
	</ul>
</nav>
<script src="js/select.js"></script>
<script>
	//吸顶效果
	$(window).scroll(function(){
		if($(document).scrollTop()>108){
			$("header").addClass("headerFixed");
			$("#header").css({
				"width":$(window).width(),
				"height":45,
				"position":"fixed",
				"left":0,
				"top":0,
				"zIndex":9999
			})			
		}else{
			$("header").removeClass("headerFixed");
			$("#header").css({
				"width":$(window).width(),
				"height":78,
				"position":"relative",
				"zIndex":1
			})			
		}
	})
	//搜索框下的信息隔行变色
	$(".search>ul li a:even").css("color","#008842");
	$(".search>ul li a:odd").css("color","#727272");
	//搜索跳转
	$(".sou").click(function(){
		if($(".shu").val()!=""){
			location.href="detail.html";
		}
	})
	
	$(".top a").attr("href","javascript:;");
	$("header a").attr("href","detail.html");
	$("nav a").attr("href","detail.html");
			
</script>